<app-delete-alert [(opened)]="showDelete" [resourceTypeName]="resourceTypeName" [items]="selectedItems"
                  (confirm)="delete()">

</app-delete-alert>

<clr-datagrid [clrDgLoading]="loading" [clrDgSelected]="selectedItems">
  <clr-dg-action-bar>
    <div class="btn-group">
      <button type="button" [disabled]="selectedItems.length===0" class="btn btn-sm btn-secondary" (click)="delete()">删除
      </button>
    </div>
    <div class="btn-group">
      <button type="button" class="btn btn-sm btn-secondary" (click)="check()">立即扫描</button>
    </div>
  </clr-dg-action-bar>

  <clr-dg-column>名称</clr-dg-column>
  <clr-dg-column>通过</clr-dg-column>
  <clr-dg-column>告警</clr-dg-column>
  <clr-dg-column>失败</clr-dg-column>
  <clr-dg-column>状态</clr-dg-column>
  <clr-dg-column>日期</clr-dg-column>
  <clr-dg-column>操作</clr-dg-column>

  <clr-dg-row *clrDgItems="let item of cises" [clrDgItem]="item">
    <clr-dg-cell>{{item.name}}</clr-dg-cell>
    <clr-dg-cell>{{item.result['PASS']}}</clr-dg-cell>
    <clr-dg-cell>{{item.result['WARN']}}</clr-dg-cell>
    <clr-dg-cell>{{item.result['FAIL']}}</clr-dg-cell>
    <clr-dg-cell><span class="badge" [ngClass]="item.status | badgeClass">{{item.status | messageLevel}} </span>
    </clr-dg-cell>
    <clr-dg-cell>{{item.date_created | date: 'yyyy-MM-dd HH:mm:ss'}}</clr-dg-cell>
    <clr-dg-cell><a href="javascript:void(0)" (click)="download(item.id)">下载扫描日志</a></clr-dg-cell>
  </clr-dg-row>
  <clr-dg-footer>
    <clr-dg-column-toggle>
      <clr-dg-column-toggle-title>显示列</clr-dg-column-toggle-title>
      <clr-dg-column-toggle-button>全部</clr-dg-column-toggle-button>
    </clr-dg-column-toggle>
    <clr-dg-pagination #pagination [clrDgPageSize]=size [clrDgTotalItems]="total" (clrDgPageChange)="listCis()">
      <clr-dg-page-size [clrPageSizeOptions]="[10,20,50,100]">每页</clr-dg-page-size>
      {{pagination.firstItem + 1}} - {{pagination.lastItem + 1}}
      总共 {{pagination.totalItems}} 个
    </clr-dg-pagination>
  </clr-dg-footer>


</clr-datagrid>
